<template>
  <div class="nva">
    <ul>
      <li>
        <img src="../../assets/icon/type.png" >
        <span class="wenzi">电台分类</span>
      </li>

      <li>
        <img src="../../assets/icon/paihang.png" alt="">
        <span class="wenzi">电台排行</span>
      </li>
      <li>
        <img src="../../assets/icon/nofree.png" alt="">
        <span class="wenzi">付费精品</span>
      </li>
      <li>
        <img src="../../assets/icon/class.png" alt="">
        <span class="wenzi">音乐课堂</span>
      </li>
    </ul>
  </div>
</template>

<script>
    export default {
        name: "index"
    }
</script>

<style scoped>
  .nva{
    width: 100vw;
    height: 110px;
    margin-top: 30px;
    border-bottom: 2px solid #F2F3F4;
  }
  .nva ul{
    width: 100vw;
    height: 110px;
  }
  .nva ul li{
    width: 25vw;
    height: 110px;
    float: left;
    margin-top: 10px;
  }
  img{
    display: inline-block;
    margin-left: 20px;
    width: 50px;
    height: 50px;
    position: relative;
    text-align: center;
  }
  .wenzi{
    width: 25vw;
    display: block;
    font-size: 12px;
    text-align: center;
    margin-top: -6px;

  }


</style>
